<!DOCTYPE html>
<!-- 用户管理  start-->
<div class="userM">
  <!-- 查询用户 start-->
  查询用户：
  <div class="example-input">
    <input placeholder="搜索用户" nz-input [(ngModel)]="inputValue" (input)="onInput($event)" [nzAutocomplete]="auto" />
    <nz-autocomplete nzBackfill #auto></nz-autocomplete>
  </div>
  <button nz-button nzType="primary">
    <i nz-icon nzType="search"></i>搜索
  </button>
  <!-- 查询用户 end-->



  <!-- 新增用户  start -->
  <button nz-button [nzType]="'primary'" (click)="open()"
    style="position: relative; left: 1000px"><span>新增用户</span></button>
  <nz-modal [(nzVisible)]="visible" nzTitle="新增用户" (nzOnCancel)="close()" (nzOnOk)="close()">
    <ng-container>
      <form nz-form  [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">
        <div nz-row [nzGutter]="8">
          <div nz-col nzSpan="20">
            <nz-form-item>
              <nz-form-label>注册用户名</nz-form-label>
              <nz-form-control  nzErrorTip="新用户密码!">
                <input nz-input formControlName='upName' placeholder="输入新用户名" />
              </nz-form-control>
            </nz-form-item>
          </div>
          <div nz-col nzSpan="20">
            <nz-form-item>
              <nz-form-label>&nbsp;真实姓名&nbsp;&nbsp;&nbsp;</nz-form-label>
              <nz-form-control nzErrorTip="新用户真实姓名!">
                <input nz-input formControlName='name'  placeholder="新用户真实姓名" />
              </nz-form-control>
            </nz-form-item>
          </div>
          <div nz-col nzSpan="20">
            <nz-form-item>
              <nz-form-label>新用户密码</nz-form-label>
              <nz-form-control nzErrorTip="新用户密码!">
                <input nz-input formControlName='password' placeholder="新用户密码注册" />
              </nz-form-control>
            </nz-form-item>
          </div>
          <div nz-col nzSpan="20">
            <nz-form-item>
              <nz-form-label>新用户工号</nz-form-label>
              <nz-form-control>
                <input nz-input formControlName='id' placeholder="新用户工号" />
              </nz-form-control>
            </nz-form-item>
          </div>
        </div>
      </form>
    </ng-container>
  </nz-modal>
  <!-- 新增用户  end -->



  <!-- 用户展示 start-->
  <nz-table #rowSelectionTable nzShowSizeChanger [nzData]="listOfData" class="showUser">
    <thead>
      <tr>
        <!-- [nzSelections] 下拉选项的内容 -->
        <th style="width: 6%">序号</th>
        <th style="width: 10%">禁用|启用</th>
        <th style="width: 10%">登录名</th>
        <th style="width: 10%">真实姓名</th>
        <th style="width: 10%">部门</th>
        <th style="width: 10%">岗位</th>
        <th style="width: 10%">联系电话</th>
        <th style="width: 10%">角色</th>
        <th style="width: 12%">最后登陆时间</th>
        <th style="width: 12%">操作</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let data of rowSelectionTable.data">
        <td>{{ data.id }}</td>
        <td>
          <nz-switch [(ngModel)]="switchValue"></nz-switch>
        </td>
        <td>{{ data.upName }}</td>
        <td>{{ data.name }}</td>
        <td>{{ data.department }}</td>
        <td>{{ data.post }}</td>
        <td>{{ data.phone }}</td>
        <td>{{ data.role }}</td>
        <td>{{ data.lastLogin }}</td>
        <td>
          <a nz-popconfirm nzPopconfirmTitle="确认删除该用户?" (nzOnConfirm)="deleteRow(data.id)">删除用户</a>
          <nz-divider nzType="vertical"></nz-divider>
          <a nz-popconfirm nzPopconfirmTitle="确认重置密码?" (nzOnConfirm)="resetPaW(data.id)">重置密码</a>
        </td>
      </tr>
    </tbody>
  </nz-table>
  <!-- 用户展示 end-->
</div>
<!-- 用户管理 end -->
